﻿@{
    ViewBag.Title = "实验室和工作组";
}

<div class="row col-md-12 ml-0" style="min-height: 3vh">
    <strong class="font-rfs">实验室和工作组管理</strong>
</div>
<div class="row col-md-12 ml-0">
    <div class="row col-md-12 ml-0" style="padding-left: 0px;padding-right: 0px;">
        <div class="row col-md-12" style="min-height: 5vh">
            <button id="addsitegroup" class="btn btn-rfs"><i class="bi-plus-square"></i> 添加</button>
            <button id="deleteSiteGroup" class="btn btn-rfs" style="margin-left:4px"><i class="bi-trash"></i> 删除</button>
        </div>
        <div class="table-responsive-sm shadow p-0 bg-white rounded col-md-12 overflow-auto" style="height:20vh;">
            <table id="tabSiteworkgroup" class="table table-striped table-bordered table-sm table-hover">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>实验室</th>
                        <th>工作组</th>
                        <th>说明</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
</div>
<div class="row rounded col-md-12 ml-0" style="padding-top: 15px;">
    <div class="row col-md-12 tab-content tab-body" style="padding-right: 0px;right: -15px;padding-left: 0px;top: -2px;min-height: 66vh;">
        <div class="col-md-12 ml-0 mr-0 tab-pane active" id="tabInventoryInfo" style="padding-left: 0px;padding-right: 0px;">
            <ul class="nav col-md-12" style="margin-bottom: 1px;padding-right: 0px;">
                <li class="tabButton col-md-1 tab-other-active font-rfs" style="text-align: center;padding-left: 1px;padding-right: 1px;height:3vh;" data-active="false">
                    <a href="" data-toggle="tab" class="text-decoration-none" style="display: inline-block;width:100%;">组用户</a>
                </li>
                <li class="col-md-11 tab-Notactive" style="text-align: center;height:3vh;"><a href="" data-toggle="tab"></a></li>
            </ul>
            <div class="row col-md-12" style="min-height:5vh;">
                <button id="GroupAndUser" class="btn btn-rfs"><i class="bi-people" style="color:#007bff"></i> 用户管理</button>
            </div>
            <div class="table-responsive-sm p-0 bg-white rounded col-md-12 pre-scrollable overflow-auto" style="height:51vh;">
                <table id="tabUsers" class="table table-striped table-bordered table-sm table-hover">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>登录名</th>
                            <th>姓名</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<div class="modal" id="myModal" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class='modal-header'>
                <p id="modalTitle" class="pt-3 pl-3 font-rfs"></p>
                <a data-dismiss="modal" class="modal-close">&times;</a>
            </div>
            <div class="modal-body">
                <div id="Embed"></div>
            </div>
        </div>
    </div>
</div>
<div class="modal" id="DeleteConfirm" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class='modal-header'>
                <p class="pt-3 pl-3 font-rfs">删除</p>
                <a data-dismiss="modal" class="modal-close">&times;</a>
            </div>
            <div class="modal-body">
                <p class="font-rfs">确认删除当前选中记录吗？</p>
            </div>
            <div class="modal-Delete-footer">
                <button id="modal-delete" class="btn btn-outline-primary border-radius-noradius noLeftBorder noRightBorder font-rfs" style="width:50%; height:fit-content">删除</button>
                <button id="modal-cancel" data-dismiss="modal" class="btn btn-outline-primary border-radius-noradius noRightBorder font-rfs" style="width:50%; height:fit-content">取消</button>
            </div>
        </div>
    </div>
</div>

@section Scripts{
    <script>
        var SiteGroupId = '';
        $(document).ready(function () {
            LoadSiteGroup();
        });

        function LoadSiteGroup() {
            var columns = [{ field: "id", visible: false }, { field: "site" }, { field: "workGroup" }, { field: "description" }];

            $('#tabSiteworkgroup').bootstrapTable('destroy'); // 这行代码必须加，否则数据无法刷新
            $('#tabSiteworkgroup').bootstrapTable({
                method: 'post',
                url: "GetSiteGroupList",
                dataType: "json",  // 服务器端返回值类型
                contentType: "application/x-www-form-urlencoded; charset=UTF-8", // 如果是 POST 请求，这个属性必须加
                queryParams: function (params) {
                    var data = {
                        // 参数
                    };
                    return data;
                },
                dataField: "rows",
                uniqueId: "id",          // 设置主键
                locale: "zh-CN",
                columns: columns,
                onClickRow: function (row, $element, field) {
                    $("#tabSiteworkgroup").find("tbody").find("tr").each(function () {
                        $(this).removeClass('changeblueColor');
                    });
                    $element.addClass("changeblueColor");
                    SiteGroupId = row.id;
                    LoadGroupUser();
                },
                silent: true,
                formatLoadingMessage: function () {
                    return "请稍等，正在加载中...";
                },
                formatNoMatches: function () {
                    return '无符合条件的记录';
                },
                onLoadError: function (data) {
                    $('#tabSiteworkgroup').bootstrapTable('removeAll');
                },
                onLoadSuccess: function (data) {
                    SetBootstrapStyle();
                },
                formatShowingRows: function (pageFrom, pageTo, totalRows) {
                    // return "正在显示第" + pageFrom + "到第" + pageTo + "条记录，总共" + totalRows + "条记录 ";
                },
                formatRecordsPerPage: function (pageNumber) {
                    return " 每页显示" + pageNumber + '条记录';
                }
            });
        }

        function LoadGroupUser() {
            var columns = [{ field: "id", visible: false }, { field: "identityName" }, { field: "fullName" }];

            $('#tabUsers').bootstrapTable('destroy'); // 这行代码必须加，否则数据无法刷新
            $('#tabUsers').bootstrapTable({
                method: 'post',
                url: "GetGroupUsers",
                dataType: "json",  // 服务器端返回值类型
                contentType: "application/x-www-form-urlencoded; charset=UTF-8", // 如果是 POST 请求，这个属性必须加
                queryParams: function (params) {
                    var data = {
                        SiteGroupID: SiteGroupId,
                        Exclude: "false"
                    };
                    return data;
                },
                dataField: "rows",
                uniqueId: "id",          // 设置主键
                locale: "zh-CN",
                columns: columns,
                onDblClickRow: function (row, $element, field) {
                    alert("shuangji");
                },
                silent: true,
                formatLoadingMessage: function () {
                    return "请稍等，正在加载中...";
                },
                formatNoMatches: function () {
                    return '无符合条件的记录';
                },
                onLoadError: function (data) {
                    $('#tabUsers').bootstrapTable('removeAll');
                },
                onLoadSuccess: function (data) {
                    SetBootstrapStyle();
                },
                formatShowingRows: function (pageFrom, pageTo, totalRows) {
                    // return "正在显示第" + pageFrom + "到第" + pageTo + "条记录，总共" + totalRows + "条记录 ";
                },
                formatRecordsPerPage: function (pageNumber) {
                    return " 每页显示" + pageNumber + '条记录';
                }
            });
        }

        $("#deleteSiteGroup").click(function () {
            if (SiteGroupId == "") {
                return false;
            }

            $("#DeleteConfirm").modal({
                backdrop: 'static',
                keyboard: false
            });
        });

        $("#modal-delete").click(function () {
            $.post("deleteSiteGroup", {
                Id: SiteGroupId
            }, function (data) {
                if (data == "删除成功！") {
                    $('#siteworkgroup').bootstrapTable('removeByUniqueId', siteworkgroupid);  // 删除指定的行
                } else {
                    alert(data);
                }
            });

            $("#DeleteConfirm").modal('hide');
        });

        $("#addsitegroup").click(function () {
            $("#modalTitle").text("添加实验室和工作组");

            $("#myModal").modal({
                backdrop: 'static',
                keyboard: false
            });

            $("#addsitegroup", parent.document.body).attr("src", "AddSiteGroup");
            $.post("AddSiteGroup", function (datas) {
                $("#Embed").html(datas);
            });
        });

        $("#GroupAndUser").click(function () {
            if (SiteGroupId.length == 0) {
                alert("请先选择工作组！");
                return;
            }
            $("#modalTitle").text("管理组用户");

            $("#myModal").modal({
                backdrop: 'static',
                keyboard: false
            });

            $.post("/Common/GroupAndUser", {
                SiteGroupID: SiteGroupId
            }, function (datas) {
                $("#Embed").html(datas);
            });

        });

    </script>
}
